import React, {Component} from 'react'
import {connect} from 'react-redux'
import {Redirect} from 'react-router-dom'
import {login} from '../../actions/user.redux'
import {Input, Button} from 'antd'
import tplFrom from '../tpl/tplfrom'
import './login.styl'

@tplFrom
@connect(
  state => state.user,
  {login}
)
class Login extends Component {
  /*constructor(props) {
    super(props)
  }*/
  render() {
    return (
      <div className="login-bg">
        <div className='logo'></div>
        {this.props.redirectTo && this.props.redirectTo !== '/login' ? <Redirect to={this.props.redirectTo}/> : null}
        <div className="m-login">
          <div className='head'>北信源网情监控平台</div>
          <div className='item'>
            <span className='user'></span>
            <Input placeholder='用户名' onChange={
              v => this.props.handleChage('account', v.target.value)
            }/>
          </div>
          <div className='item'>
            <span className='password'></span>
            <Input placeholder='密码' type="password" onChange={
              v => this.props.handleChage('password', v.target.value)
            }/>
          </div>
          <p className='error-msg'>{this.props.msg}</p>
          <Button className='' type='primary' onClick={() => this.props.login(this.props.state)}>登录</Button>
        </div>
      </div>
    )
  }
}

export default Login